import type { App } from 'vue';
import type { RouteRecordRaw } from 'vue-router';
import { createRouter, createWebHistory } from 'vue-router';
import { setupPageGuard } from './permission';
// import { ChatLayout } from '@/views/chat/layout'
import Layout from '@/layout/index.vue';

const routes: RouteRecordRaw[] = [
  {
    path: '/',
    name: 'Root',
    component: Layout,
    redirect: '/home',
    children: [
      {
        path: '/home',
        name: 'home',
        component: () => import('@/pages/home/index.vue'),
      },
      {
        path: '/task',
        name: 'task',
        component: () => import('@/pages/task/index.vue'),
      },
      {
        path: '/config',
        redirect: '/config/ship',
      },
      {
        path: '/config/ship',
        name: 'configShip',
        component: () => import('@/pages/config/ship/index.vue'),
      },
      {
        path: '/config/user',
        name: 'configUser',
        component: () => import('@/pages/config/user/index.vue'),
      },
      {
        path: '/config/data',
        name: 'configData',
        component: () => import('@/pages/config/data/index.vue'),
      },
      {
        path: '/login',
        name: 'login',
        component: () => import('@/pages/login/index.vue'),
      },
    ],
  },

  {
    path: '/404',
    name: '404',
    component: () => import('@/pages/exception/404/index.vue'),
  },

  {
    path: '/500',
    name: '500',
    component: () => import('@/pages/exception/500/index.vue'),
  },

  {
    path: '/:pathMatch(.*)*',
    name: 'notFound',
    redirect: '/404',
  },
]

export const router = createRouter({
  history: createWebHistory(),
  routes,
  scrollBehavior: () => ({ left: 0, top: 0 }),
});

setupPageGuard(router);

export async function setupRouter(app: App) {
  app.use(router);
  await router.isReady();
}
